<template>
	<div class="py-4 px-3 h-[80vh] overflow-y-auto">
		<h2 class="text-1.5xl text-zinc-900 font-bold mb-4">所有分类</h2>
		<ul>
			<li
				class="font-semibold text-zinc-600 mb-2"
				v-for="(item, index) in categoryData"
				:key="item.id"
				@click="storeIndex(index)">
				{{ item.name }}
			</li>
		</ul>
	</div>
</template>

<script setup>
const props = defineProps({
	categoryData: {
		type: Array,
		required: true,
	},
})
const emits = defineEmits(['onItemClick'])

const storeIndex = (index) => {
	emits('onItemClick', index, true)
}
</script>

<style lang="scss" scoped></style>
